<template>
    <div>
        <img src="https://gw.alicdn.com/imgextra/i4/O1CN01YWIBRe246geG7k7g1_!!6000000007342-0-tps-750-691.jpg_790x10000Q75.jpg_.webp" alt="" @click="fun">
        <div class="waterfall">
            <List v-for="(v, index) in arr" :key="index" :img1="v.img1" :proname="v.proname" :originprice="v.originprice" :sales="v.sales" @click.native="goDetail1(v)"></List>
        </div>
    </div>
</template>

<script>
// 许妮的
import List from '@/components/xn/HomeCom/Goods/List.vue';
export default {
    name:"getCoin",
    components:{
        List,
    
    },
    data(){
        return {
            arr:[]
        }
    },
    mounted(){
        this.$http({
            url:`http://118.178.238.19:3001/api/pro/recommendlist`,
            method:"get",
            params:{
                count:6
            }
        }).then(res=>{
            this.arr = res.data.data
            console.log(res.data.data)
        })
    },
    // methods:{
    //     async getLike() {
    //         const { data: res } = await this.$http.get('http://118.178.238.19:3001/api/pro/recommendlist?count=5')
    //         this.arrList2 = res.data
    //     },
    // }
    methods:{
        //进入详情页 ,点击传入数组每一项对象,传的数据是对象需要转为字符串
      goDetail1(v) {
         this.$router.push({
            path: '/detail',
            query: {
               delList: JSON.stringify(v)
            }
         })
      },
      fun(){
        this.$router.push("/phoneopen")
      }
    }
}
</script>

<style lang="scss" scoped>
    div img {
        width: 100%;
        height: 6.92rem;
    }
    .waterfall {
        column-count: 2;
    }
</style>